import "./App.css";
import { useState } from "react";
import { Outlet, Link } from "react-router-dom";

const App = () => {
  // MVVM -> modlue-view-viewModlue
  // 数据层
  const [num, setNum] = useState(0);

  // 逻辑层
  const clickAdd = () => {
    setNum(num + 1);
  };

  // 视图层
  return (
    <div className="App">
      <h1 onClick={clickAdd}>这是一个函数组件{num}一级路由</h1>
      <Outlet/>
      <Link to={`about`}>About</Link>
      <Link to={`inbox`}>Inbox</Link>
    </div>
  );
};

export default App;
